<template>
	<view class="content">
		<image class="logo" src="/static/hospital.png"></image>
		<view class="text-area">
			<!-- <button v-if="isPatient" class="registrationBtn" @click="registration">预约挂号</button> -->
			<view class="functionBtn" v-if="isPatient">
				<image class="btnImg" src="../../static/registration.png" @click="registration"></image>
				<text>预约挂号</text>
			</view>
			<view class="functionBtn">
				<image class="btnImg" src="../../static/record.png" @click="registrationRecord"></image>
				<text>挂号记录</text>
				<!-- <button class="registrationBtn" @click="registrationRecord">挂号记录</button> -->
				<!-- <view class="line"></view> -->
				<!-- <button class="btn" @click="medicalRecord">体检记录</button> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				isPatient: false
			}
		},
		onLoad() {
			this.isPatient = uni.getStorageSync('user').patient
			// this.getList()
			console.log(this.isPatient)
			// let val = uni.getStorageSync('user')
			console.log(val)
		},
		onReady() {
		},
		methods: {
			getList() {
				this.$request('hospital/health-care-knowledge/list',{
					current: 1,
					size: 10
				}).then(res => {
					console.log(res)
				})
			},
			// 预约挂号
			registration() {
				uni.navigateTo({
					url: '/pages/booking/booking'
				})
			},
			// 挂号记录
			registrationRecord() {
				if(!this.isPatient) {
					uni.navigateTo({
						url: '/pages/registrationRecord/registration-doctor?id='+uni.getStorageSync('user').id
					})
				} else {
					uni.navigateTo({
						url: '/pages/registrationRecord/registrationRecord?id='+uni.getStorageSync('user').id
					})
				}
			},
			// 体检记录
			medicalRecord() {
				uni.navigateTo({
					url: '/pages/medicalRecord/medicalRecord'
				})
			},
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 50rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	.functionBtn {
		background-color: #f2f3f5;
		padding-top: 40rpx;
		padding-bottom: 40rpx;
		margin-top: 20rpx;
		width: 85%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		border-radius: 20rpx;
	}
	.btnImg {
		width: 110rpx;
		height: 110rpx;
	}
	.functionBtn text {
		font-size: larger;
		color: #545454;
		font-weight: bold;
		margin-top: 15rpx;
	}
	.registrationBtn {
		width: 100%;
		margin-top: 100rpx;
		background-color: rgba(74,141,156,0.9);
		color: white;
		border-radius: 98rpx;
		display: flex;
	    flex-direction: row;
		align-items: center;
		justify-content: center;
	}
	.registrationBtn::after {
		border-radius: 98rpx;
		border: 0; 
	}
	.record {
		margin-top: 40rpx;
		width: 100%;
		display: flex;
		justify-content: center;
		flex-direction: row;
		border-radius:20px;
		border:1px solid rgba(74,141,156,0.9);
	}
	.line {
		height: 100rpx;
		width: 1rpx;
		background-color: rgba(74,141,156,0.5);
		
	}
	.btn {
		margin-left: 1rpx;
		width: 50%;
		color: #333333;
		border-radius: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.btn::after {
		border-radius: 20px;
		border: 0; 
	}
	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
